<template>
  <div style="height: calc(100vh - 237px); " class="w-full flex items-center justify-center">
    <div style="width: 720px; flex-grow: 0 !important" class="flex">
      <!-- <div
        style="height: 200px; width: 158px; flex-grow: 0 !important"
        class="grow-0 cursor-pointer hover:shadow-md rounded flex flex-col bg-slate-50"
      >
        <div style="height: 158px" class="flex items-center justify-center">
          <i class="el-icon-document-add" style="font-size: 32px"></i>
        </div>
        <div style="height: 42px" class="flex items-center justify-center">
          <span>新建接口</span>
        </div>
      </div> -->
      <div
        @click="onNavTo"
        style="
          margin-left: 30px;
          height: 200px;
          width: 158px;
          flex-grow: 0 !important;
        "
        class="cursor-pointer hover:shadow-md rounded w-1/4 flex flex-col bg-slate-50"
      >
        <div style="height: 158px" class="flex items-center justify-center">
          <i class="el-icon-magic-stick" style="font-size: 32px"></i>
        </div>
        <div style="height: 42px" class="flex items-center justify-center">
          <span>快捷请求</span>
        </div>
      </div>
    </div>
  </div>
</template>
  
  <script>
import { ref } from "@vue/composition-api";
import router from "@/router";
import { useApiStore } from "@/store/api";

export default {
  setup() {
    const apiStore = useApiStore();
    function onNavTo() {
      apiStore.toBlankQuick()
    }
    return {
      apiStore,
      onNavTo,
    };
  },
};
</script>
  
  <style scoped>
</style>